<extend name="public:base"/>

<block name="css">
    <if condition="($bank.bank_code neq '' and $is_bank eq 0) or $is_bank eq 1">
        <link rel="stylesheet" href="__CSS__/member.css?v={:config('app_ver')}">
        <else/>
        <link rel="stylesheet" href="__CSS__/sign.css?v={:config('app_ver')}"/>
        <style type="text/css">
            .position, .m_i_nav, .frame_title, .frame_slide {
                display: none;
            }
        </style>
    </if>
</block>

<block name="main">
    <div class="slide_main fr">
        <h1 class="frame_title mb10">银行卡管理</h1>
        <div class="frame_slide" id="rotate">
            <ul class="hd cl">
                <li <if condition="$Request.action eq 'index'">class="first on"<else/>class="first"</if>>
                    <a href="{:url('uc/bank/index')}">我的银行卡</a>
                </li>
            </ul>
            <div class="af60" style="position:absolute; top:16px; line-height:20px; right:0;">同卡进出更安全</div>
        </div>
        <div class="frame_slide_con">

            <if condition="$is_bank eq 0">
                <if condition="$bank.bank_code neq ''">
                    <div class="bankList">
                        <ul>
                            <li>
                                <div class="bankLogo">
                                    <notempty name="bank.bank_code">
                                        <img src="__IMG__/<if condition='$is_bank eq 0'>old_bank<else/>bank</if>/{$bank.bank_code}.jpg"
                                             alt="{$bank.bank_name}">
                                        <else/>
                                        <span class="bankName">{$bank.bank_name|default='请完善银行卡信息'}</span>
                                    </notempty>
                                </div>
                                <div class="user">持卡人：*{$info.real_name|mb_substr=1,3,'utf-8'}</div>
                                <div class="bankNumber">
                                    {$bank.card_id|substr=0,4|default='****'} **** ****
                                    {$bank.card_id|substr=-4,4|default='****'}
                                </div>
                                <if condition="empty($bank['bf_bind_id'])">
                                    <a href="{:url('/uc/recharge')}" class="unbind left">开通快捷支付</a>
                                </if>
                                <eq name="$check" value="0">
                                    <a href="javascript:void(0);" id="replaceBtn" class="unbind">申请银行卡变更</a>
                                <else/>
                                    <a href="javascript:void(0);" class="unbind"><span class="a999">申请银行卡变更审核中</span></a>
                                </eq>
                            </li>
                        </ul>
                    </div>

                    <!-- 申请变更 密码验证 -->
                    <div id="password" class="hide">
                        <div class="pt20 pb15 pl20 pr20" id="password-inset">
                            <input type="password" class="input_t" style="width: 250px;" maxlength="6" id="password-input" autocomplete="off"/>
                        </div>
                    </div>

                    <else/>
                    <div class="regWrapper">
                        <div class="regTitle cl">
                            <h2 class="fl f22">绑定银行卡</h2>
                            <span class="fr a999">绑定银行卡，绑定银行卡后才能进行快捷支付</span>
                        </div>
                        <div class="newRegStep cl forgetPwd">
                            <form action="{:url('uc/safe/bind_bank')}" method="post" id="add_form">
                                <input type="hidden" id="bank_name" name="bank_name"/>
                                <input type="hidden" id="bank_code" name="bank_code"/>
                                <!--<input type="hidden" id="bank_card_type" name="bank_card_type" />-->
                                <ul class="fl">
                                    <li class="minLi">
                                        <div class="text">开户人姓名：</div>
                                        <div class="right af60"><span class="f16">*{$info.real_name|mb_substr=1,3,'utf-8'}</span>
                                        </div>
                                    </li>
                                    <li class="minLi">
                                        <div class="text">身份证号：</div>
                                        <div class="right af60"><span class="f16">{$info.idcard|mb_substr=0,6}********{$info.idcard|mb_substr=-4,4}</span>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="text">开户银行：</div>
                                        <div class="right">
                                            <select class="select" style="width: 312px;" id="selectBank">
                                                <volist name="bank_list" id="v">
                                                    <option value="{$v.bank_code}"
                                                    <if condition="$i eq 1">selected="selected"</if>
                                                    >{$v.bank_name}</option>
                                                </volist>
                                            </select>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="text">银行卡号：</div>
                                        <div class="right">
                                            <input class="input_t" id="bank" name="card_id" value="" type="text"
                                                   placeholder=""/>
                                            <a href="javascript:void(0);" class="af90 bankQuota">查看银行限额？</a>
                                        </div>
                                    </li>
                                    <!--
                                    <li>
                                        <div class="text">开户城市：</div>
                                        <div class="right">
                                            <select id="s_province" name="province" class="select"></select>
                                            <select id="s_city" name="city" class="select"></select>
                                            <select id="s_county" name="district" class="select"></select>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="text">支行名称：</div>
                                        <div class="right">
                                            <input class="input_t" id="card_address" name="card_address" maxlength="20" value="" type="text" />
                                        </div>
                                    </li>
                                    -->
                                </ul>
                                <div class="submitLine">
                                    <p class="mb20 mt10">
                                        <input type="submit" value="确定绑卡" class="btn_b" id="inputSubmit"/>
                                    </p>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div id="bankList_info" class="bankOpenFrame hide">
                        <p class="af00 small">提示：新卡首笔充值2个自然日后为老卡（24小时为一个自然日）</p>
                        <ul class="bankList pt05">
                            <volist name="banklist" id="v">
                                <li>
                                    <img src="__IMG__/old_bank/{$v.bank_code}.jpg" class="bankImage"/>
                                    <!--<p class="blue">{$v.bank_name}</p>-->
                                    <p class="a999 small">{$v.card_limit}</p>
                                </li>
                            </volist>
                        </ul>
                    </div>
                </if>

                <else/>

                    <notempty name="bank">
                    <div class="bankList">
                        <ul>
                            <li>
                                <div class="bankLogo">
                                    <notempty name="bank.bank_code">
                                        <img src="__IMG__/bank/{$bank.bank_code}.jpg" alt="{$bank.bank_name}">
                                        <else/>
                                        <span class="bankName">{$bank.bank_name|default='请完善银行卡信息'}</span>
                                    </notempty>
                                </div>
                                <div class="user">持卡人：*{$bank.bank_user|mb_substr=1,3,'utf-8'}</div>
                                <!--<div class="bankAddress">{$bank.province}/{$bank.city}/{$bank.district}</div>-->
                                <div class="bankNumber">
                                    {$bank.card_id|substr=0,4} **** **** {$bank.card_id|substr=-4,4}
                                </div>

                                <div class="unbind">
                                    <!--<form action="{:url('uc/bank/unbind_bankcard')}" method="post" target="_blank"></form>-->
                                    <input type="button" id="unbindBank" onclick="showPop()" value="解绑银行卡">
                                </div>

                            </li>
                        </ul>
                    </div>

                    <div id="unbind">
                        <div class="unbindBank">
                            <div class="title">
                                <span class="fl">确认身份信息</span>
                                <a href="javascript:closePop()" class="closeBtn"><i class="iconFont fr">&#xe602;</i></a>
                            </div>
                            <form action="{:url('uc/bank/unbind_bankcard')}" method="post" id="form">
                                <div class="row">
                                    <span>身份证号：</span>
                                    <input type="text" class="input_t" autocomplete="off" name="id_card" value=""
                                           id="idCard"/>
                                </div>
                                <div class="row">
                                    <span>银行卡号：</span>
                                    <input type="text" class="input_t" autocomplete="off" name="card_id" value=""
                                           id="bank"/>
                                </div>
                                <div class="row last">
                                    <input type="submit" value="确定" class="btn_b">
                                </div>
                            </form>
                        </div>
                    </div>
                    <else/>
                    <div class="bankList">
                        <ul>
                            <li class="add">
                                <a href="{:url('uc/bank/bind_bankcard')}">
                                    <i class="icon"></i>
                                    <p><i class="iconFont">&#xe619;</i>添加银行卡</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </notempty>
            </if>

        </div>
    </div>
</block>

<block name="js">

    <script type="text/javascript" src="__JS__/checkcode.js?v={:config('app_ver')}"></script>
    <script type="text/javascript">
        $(".bankQuota").click(function () {
            layer.open({
                type: 1,
                title: "银行限额提示",
                content: $("#bankList_info"),
                area: ['704px', '448px'],
                btn: []
            });
        });
    </script>
    <if condition="$is_bank eq 1">
        <script type="text/javascript">
            function closePop() {
                $("#unbind").fadeOut("fast");
            }

            function showPop() {
                $("#unbind").fadeIn("fast");
            }

            $("#form").submit(function () {
                if (!checkIdCodeOne()) return false;
                if (!checkBank()) return false;
                closePop();
            });
        </script>
        <else/>

        <script type="text/javascript">

            $("#replaceBtn").click(function () {
                var status = parseInt('{$pin_status}');
                if(status === 1){
                    layer.open({
                    type: 1,
                    area: ['300px'],
                    shade: [0.3, '#000'],
                    title: '输入支付密码，并确认',
                    btn: ["确认",'取消'],
                    content: $('#password'), //捕获的元素
                    yes: function (index) {
                        var pass = $('#password-input').val();
                        if(check_pay_pass(pass) === false) return false;
                        layer.close(index);
                        layer.load(0, {shade:[0.5, '#000'],time: 5*1000});
                        $.post("{:url('uc/bank/check_pin_pass')}", { pay_pass : pass }, success, "json");
                        function success(data){
                            if(data.code == 1){
                                window.location.href = "{:url('uc/bank/replace')}";
                            } else {
                                layer.closeAll();
                                layer.alert(data.msg,{icon:2});
                                $('#password-input').val("");
                                return false;
                            }
                        }
                    },success:function () {
                        $("#password-input").focus();
                    },
                    cancel: function(){}
                });
                }else{
                    // 未设置支付密码
                    layer.confirm('您还未设置支付密码，立即去设置？', {btn: ["确认",'取消']}, function(index){
                        layer.close(index);
                        window.location.href = "{:url('uc/safe/pay_pass')}";
                    });

                    return false;
                }
            });

            // 添加卡
            $("#add_form").submit(function () {
                if (!checkBank()) {
                    return false
                }
                return ajax_post($(this), 0);
            });

            // 选择卡
            $("#selectBank").each(function () {
                var select = $(this).find("option:selected");
                $("#bank_code").val(select.val());
                $("#bank_name").val(select.html());
                $(this).change(function () {
                    var name = $(this).find("option:selected").html();
                    $("#bank_code").val($(this).val());
                    $("#bank_name").val(name);
                });
            })
        </script>
    </if>
</block>